<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
         trimDirectiveWhitespaces="true"%>
<%@ page import="com.myfoon.action.backing.system.CountryBean"%>
<%@ page import="com.myfoon.model.entity.CountryName"%>
<%@ page import="java.util.List"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<fmt:setLocale value="${param['lang']}" scope="session"/>
<c:if test="${param['lang'] != null}">
    <fmt:setLocale value="${param['lang']}" scope="session"/>
</c:if>
<%     
    CountryBean countryBean = new CountryBean();    
    List<CountryName> ctrList = countryBean.findAllByLang("en_US");
    request.setAttribute("ctrList", ctrList);    
%>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <link rel="stylesheet" type="text/css" href="/style/login.css"/>
        <link rel="stylesheet" type="text/css" href="/style/global.css"/>
        <script type="text/javascript" src="/js/utils.js"></script>
        <title>Myfoon</title>
    </head>
    <body>
        <div class="content">
            <div class="top">
                <select class="f_fselect">
                    <option value="1">English</option>
                </select>
            </div>
             
            <div class="middle">
                <div class="left">
                    <h2>
                        <fmt:message key="global.whatismyfoon"/>
                    </h2>
                     
                    <div style="margin-top:8px"></div>
                     
                    <div style="width: 350px">
                        <h3>Myfoon lets you share where and how you spend your
                            time, with your friends and the world.</h3>
                    </div>
                     
                    <div style="margin-top:15px"></div>
                     
                    <div class="img"></div>
                     
                    <div class="su">
                        <div class="hint" id="_form_su_err1"
                             style="display: none;">
                            <div class="pointer"></div>
                        </div>
                         
                        <h2>
                            <fmt:message key="global.signup"/>
                        </h2>
                         
                        <div style="margin-top: 10px"></div>
                         
                        <div style="margin-left: 10px; height: 215px;">
                            <form method="POST" action="/accounts/Register">
                                <table cellspacing="0" cellpadding="0"
                                       border="0" summary="" width="100%">
                                    <tbody>
                                        <tr>
                                            <td>
                                                <label class="f_sflabel"
                                                       for="su_email">
                                                    <fmt:message key="global.email"/>
                                                </label>
                                            </td>
                                            <td>
                                                <input id="su_email"
                                                       name="su_email"
                                                       class="f_finput"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <div style="margin-top:3px"></div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <label class="f_sflabel"
                                                       for="su_password">
                                                    <fmt:message key="global.password"/>
                                                </label>
                                            </td>
                                            <td>
                                                <input id="su_password"
                                                       type="password"
                                                       name="su_password"
                                                       class="f_finput"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <div style="margin-top:3px"></div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td nowrap>
                                                <label class="f_sflabel"
                                                       for="su_fullname">
                                                    <fmt:message key="global.fullname"/>
                                                </label>
                                            </td>
                                            <td>
                                                <input id="su_fullname"
                                                       name="su_fullname"
                                                       class="f_finput"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <div style="margin-top:3px"></div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td nowrap>
                                                <label class="f_sflabel"
                                                       for="su_gender">
                                                    <fmt:message key="global.gender"/>
                                                </label>
                                            </td>
                                            <td>
                                                <select id="su_gender"
                                                        class="f_fdefault"
                                                        name="su_gender">
                                                    <option value="0">
                                                        <fmt:message key="global.gender.female"/>
                                                    </option>
                                                    <option value="1">
                                                        <fmt:message key="global.gender.male"/>
                                                    </option>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <div style="margin-top:3px"></div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td nowrap>
                                                <label class="f_sflabel"
                                                       for="su_dateofbirth">
                                                    <fmt:message key="global.dateofbirth"/>
                                                </label>
                                            </td>
                                            <td>
                                                <select id="su_month"
                                                        class="f_fdefault"
                                                        name="su_month">
                                                    <option value="0">
                                                        <fmt:message key="global.month"/>
                                                    </option>
                                                    <c:forEach begin="1"
                                                               end="12"
                                                               var="month">
                                                        <option value="${month}">
                                                            <fmt:message key="global.month.${month}"/>
                                                        </option>
                                                    </c:forEach>
                                                </select>
                                                <select id="su_day"
                                                        class="f_fdefault"
                                                        name="su_day">
                                                    <option value="0">
                                                        <fmt:message key="global.day"/>
                                                    </option>
                                                    <c:forEach begin="1"
                                                               end="31"
                                                               var="day">
                                                        <option value="${day}">
                                                            ${day}
                                                        </option>
                                                    </c:forEach>
                                                </select>
                                                <select id="su_year"
                                                        class="f_fdefault"
                                                        name="su_year">
                                                    <option value="0">
                                                        <fmt:message key="global.year"/>
                                                    </option>
                                                    <% for(int i = 2000; i >= 1900; i--) { %>
                                                    <option value="<%= i %>">
                                                        <%= i %>
                                                    </option>
                                                    <% } %>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <div style="margin-top:3px"></div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <label class="f_sflabel"
                                                       for="su_country">
                                                    <fmt:message key="global.country"/>
                                                </label>
                                            </td>
                                            <td>
                                                <select id="su_country"
                                                        class="f_fctr"
                                                        name="su_country">
                                                    <option value="0" selected="selected">
                                                        <fmt:message key="global.selectcountry"/>
                                                    </option>
                                                    <c:forEach var='ctr'
                                                               items='${ctrList}'>
                                                        <option value="${ctr.country.id}">
                                                            ${ctr.name}
                                                        </option>
                                                    </c:forEach>
                                                </select>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <div style="margin-top:3px"></div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <input type="submit"
                                                       value='<fmt:message key="global.register"/>'></input>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <div style="margin-top:2px"></div>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td></td>
                                            <td>
                                                <span class="f_fplink">
                                                    <a href="/accounts/TermsOfService"><fmt:message key="global.terms.accept"/></a>
                                                </span>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </form>
                        </div>
                    </div>
                </div>
                 
                <div class="right">
                    <div class="sb">
                        <div class="sb_b">
                            <div class="sb_l">
                                <div class="sb_r">
                                    <div class="sb_bl">
                                        <div class="sb_br">
                                            <div style="padding-top: 5px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px;">
                                            <h2>
                                                <fmt:message key="global.login1"/>
                                            </h2>                                            
                                            <div style="margin-top: 10px; margin-left: 10px;">
                                                <form method="POST"
                                                      action="/accounts/Login" onsubmit="login_OnSubmit();">
                                                    <table cellspacing="0"
                                                           cellpadding="0"
                                                           border="0"
                                                           width="100%"
                                                           summary="">
                                                        <tbody>
                                                            <tr>
                                                                <td>
                                                                    <label class="f_lflabel"
                                                                           for="email">
                                                                        <fmt:message key="global.email"/>
                                                                    </label>
                                                                </td>
                                                                <td>
                                                                    <input id="email"
                                                                           class="f_finput"
                                                                           name="email"/>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td></td>
                                                                <td>
                                                                    <div style="margin-top:3px"></div>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td>
                                                                    <label class="f_lflabel"
                                                                           for="password">
                                                                        <fmt:message key="global.password"/>
                                                                    </label>
                                                                </td>
                                                                <td>
                                                                    <input type="password"
                                                                           id="password"
                                                                           class="f_finput"
                                                                           name="password"/>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td></td>
                                                                <td>
                                                                    <div style="margin-top:3px"></div>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td></td>
                                                                <td>
                                                                    <input type="submit"
                                                                           value='<fmt:message key="global.login2"/>'></input>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td></td>
                                                                <td>
                                                                    <div style="margin-top:3px"></div>
                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <td></td>
                                                                <td>
                                                                    <span class="f_fplink">
                                                                        <a href="/accounts/ForgotPassword"><fmt:message key="global.forgotpassword"/></a>
                                                                    </span>
                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <input type="hidden" id = "tz_offset" name="tz_offset"/>
                                                </form>
                                            </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                 
                <div class="clear"></div>
            </div>
             
            <div class="bottom">
                <div style="float: left; top: 0px;">
                    <table cellspacing="0" cellpadding="0" border="0"
                           summary="">
                        <tbody>
                            <tr>
                                <td>
                                    <span class="f_lsmall">
                                        <fmt:message key="global.myfoon"/>
                                    </span>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                 
                <div style="float: right; right: 0px; top: 0px;">
                    <table cellspacing="0" cellpadding="0" border="0"
                           summary="">
                        <tbody>
                            <tr>
                                <td>
                                    <span class="f_lsmall">
                                        <fmt:message key="global.about"/>
                                    </span>
                                </td>
                                
                                <td><span class="f_separator"></span></td>
                                <td>
                                    <span class="f_lsmall">
                                        <fmt:message key="global.advertise"/>
                                    </span>
                                </td>
                                <td><span class="f_separator"></span></td>
                                <td>
                                    <span class="f_lsmall">
                                        <fmt:message key="global.privacy"/>
                                    </span>
                                </td>
                                <td><span class="f_separator"></span></td>
                                <td>
                                    <span class="f_lsmall">
                                        <fmt:message key="global.help"/>
                                    </span>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </body>
</html>